<template>
  <div id="user_feedback">
    <k-header headTitle="个人中心" goBack="true" rightTitle="提交" @rightClick="oBtn" v-model="success"></k-header>
   <div class="user_feedback_info" :class="headIos?'side-fixd-ios':'side-fixed'">
     <group class="user_feedback_message">
       <x-textarea class="user_message_info" placeholder="请填写详细信息" v-model="feedback" />
     </group>
   </div>
    <div class="user_feedback_footer">
      <label class="user_footer_info">copyright@2016 I All rights reserved</label>
    </div>
    <toast v-model="success" @on-hide="onHide">提交成功！</toast>
    <alert></alert>
    <confirm>
    </confirm>
    <div v-transfer-dom>
      <x-dialog v-model="show" hide-on-blur >你是那个鬼呀</x-dialog>
    </div>

  </div>
</template>

<script>
  import kHeader from '../common/head'
  import { Cell, Group, Alert, Confirm, XDialog, XTextarea, ToastPlugin, Toast } from 'vux'
  import { TransferDomDirective as TransferDom } from 'vux'
  import util from '../../libs/util'
  // Vue.use(ToastPlugin)
  export default {
    name: 'hello',
    directives: {
      TransferDom
    },
    data () {
      return {
        show:false,
        feedback: '',
        success: false,
        headIos: false
      }
    },
    components: {
      kHeader,
      Cell,
      Group,
      Alert,
      Confirm,
      XDialog,
      XTextarea,
      ToastPlugin,
      Toast
    },
    methods:{
      oBtn:function(val){
        let that = this;
        var url = 'lblsapp-h5/v2/memberInfo/saveFeedBack.json';
        let datas = {feedContent:this.feedback};
        if (this.feedback){
          util.ajax.post(url,datas).then(function(stats){
            console.log(stats);
            that.success = true;
          }).catch(function(error){
            console.log(error);
          })
        } else {
          //提示提交不成功。
        }
      },
      onHide() {//隐藏时跳转到个人中心首页
        console.log(146543);
        this.$router.push('/center');
      }
      // showPlugin () {
      //   this.$vux.alert.show({
      //     title: 'mmp的',
      //     content: '说的就是你呀',
      //     onShow () {
      //       console.log('咋回事打开了？')
      //     },
      //     onHide () {
      //       console.log('咋回事关闭了？')

      //     }
      //   })
      // },
      // showPluginAuto () {
      //   this.showPlugin()
      //   setTimeout(function () {
      //     this.$vux.alert.hide()
      //   }, 3000)
      // },
      // showConfirm () {
      //   var that = this;
      //   this.$vux.confirm.show({
      //     title: '你好呀',
      //     content: '你确定要吃翔？',
      //     onShow () {
      //       console.log('confirm出现')
      //     },
      //     onHide () {
      //       console.log('confirm隐藏')
      //     },
      //     onCancel () {
      //       console.log('点击取消')
      //     },
      //     onConfirm () {
      //       console.log('点击确定')
      //       that.show = true;
      //     }
      //   })
      // }


    },
    created() {
      if (window.navigator.userAgent.indexOf('LBLSIOS') > -1) {
        this.headIos = true;
      }
    }

  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .user_feedback_info{
    top: 3rem;
    position: absolute;
    width: 100%;
  }
  .side-fixd-ios {
    margin-top: 20px;
  }
  .user_feedback_message{
    margin: auto;
    padding: 0 10px;
  }
  .user_message_info{
    height: 175px;
  }
  .user_feedback_footer{
    position: absolute;
    bottom: 6rem;
    width: 100%;
    text-align: center;
  }
  .user_footer_info{
    font-size: 1.2rem;
    color: #DEDEDE;
  }

</style>
